<template>
  <div class="main-menu">
    <VXETable
      ref="menuTable"
      :tableOption="tableOption"
      @radioChangeEvent="radioChangeEvent"
    >
      <template v-slot:tableButton>
        <el-button type="primary" @click="deleteMenuList"
          ><el-icon><Delete /></el-icon>&nbsp;
          {{ $t(lang.delete) }}</el-button
        >
      </template>
    </VXETable>
  </div>
</template>

<script setup lang="ts">
import VXETable from "@/components/vxe-table/index.vue";
import tableOption from "./data/data";
import { deleteList } from "@/api/leavemsg";
import { ElMessage } from "element-plus";
import { inject } from 'vue';
const menuTable = ref();
const lang:any = reactive(inject('langs'))
let redioSelect = reactive({ id: "" });
onMounted(() => {
  menuTable.value.getTableList("/leavemsg/all", "post");
});
const deleteMenuList = () => {
  if (redioSelect.id == "") {
    ElMessage({
      showClose: true,
      message: "请选择一条数据",
      type: "warning",
    });
    return;
  }
  let obj = { id: redioSelect.id };
  deleteList(obj).then((res: any) => {
    if (res.code == 200) {
      ElMessage({
        showClose: true,
        message: res.message,
        type: "success",
      });
      menuTable.value.getTableList("/leavemsg/all", "post");
    }
  });
};
const radioChangeEvent = (data: any) => {
  redioSelect = data;
};
</script>

<style scoped lang="scss">
.main-menu {
  background-color: #fff;
  border-radius: 4px;
  padding: 20px;
  min-height: 500px;
}
</style>
